<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      * {
        margin: 0;
        padding: 0;
        font-size: 0;
      }
      span {
        display: inline-block;
        height: 15px;
        width: 15px;
        border: solid pink 1px;
        box-sizing: content-box;
      }
      i {
        display: inline-block;
        width: 15px;
        height: 15px;
        background-color: thistle;
        border: solid thistle 1px;
        box-sizing: content-box;
      }
    </style>
  </head>
  <body>
    <script>
      for (var i = 0; i < 15; i++) {
        for (var j = 0; j < 20; j++) {
          if (i == 2) {
            if (j == 3) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 3) {
            if (j == 3 || j == 19 || j == 7 || j == 10 || j == 8 || j == 9) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 4) {
            if (j == 3 || j == 13 || j == 19 || j == 6 || j == 11) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 5) {
            if (j == 3 || j == 14 || j == 18 || j == 6 || j == 11) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 6) {
            if (j == 3 || j == 15 || j == 18 || j == 6 || j == 11) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 7) {
            if (
              j == 3 ||
              j == 0 ||
              j == 16 ||
              j == 17 ||
              j == 6 ||
              j == 11 ||
              j == 12
            ) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 8) {
            if (
              j == 1 ||
              j == 2 ||
              j == 16 ||
              j == 7 ||
              j == 10 ||
              j == 8 ||
              j == 9 ||
              j == 13
            ) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 9) {
            if (j == 5 || j == 15) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 10) {
            if (j == 4 || j == 14) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 11) {
            if (j == 4 || j == 13) {
              document.write("<i></i>");
              continue;
            }
          }
          if (i == 12) {
            if (
              j == 4 ||
              j == 12 ||
              j == 11 ||
              j == 10 ||
              j == 9 ||
              j == 8 ||
              j == 7 ||
              j == 6 ||
              j == 5
            ) {
              document.write("<i></i>");
              continue;
            }
          }
          document.write("<span></span>");
        }
        document.write("<br/>");
      }
    </script>
  </body>
</html>
